<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<button onclick="funa()">修改表头样式</button>
<button onclick="funb()">点我新增一行内容</button>
<button onclick="func()">点我删除第3行</button>
<button onclick="fund()">点我复制最后一行</button>
<table border="1">
  <tr>
    <th>书名</th>
    <th>价格</th>
  </tr>
  <tr>
    <td>《从你的全世界路过》</td>
    <td>¥56.8</td>
  </tr>
  <tr>
    <td>《左耳》</td>
    <td>¥77</td>
  </tr>
  <tr>
    <td>《不好意思我也是第一次当大人》</td>
    <td>¥66.8</td>
  </tr>
</table>
<script>
  // 修改表头样式
function funa() {
  document.getElementsByTagName("tr")[0].setAttribute("style","background-color:gray;color:white;font-weight:bolder");
}
  // 点我新增一行内容
function funb() {
  var newtr = document.createElement("tr");
  var newtda = document.createElement("td");
  var newtdb = document.createElement("td");
  newtda.innerText="《独居的一年》";
  newtdb.innerText="￥88";
  newtr.appendChild(newtda);
  newtr.appendChild(newtdb);
  document.getElementsByTagName("tr")[0].parentNode.appendChild(newtr);
}
  // 点我删除第3行
  function func() {
    var tra = document.getElementsByTagName("tr")[2];
    tra.parentNode.removeChild(tra);
  }
  // 点我复制最后一行
  function fund() {
    var newcn = document.getElementsByTagName("tr")[3].cloneNode(true);
    // document.getElementsByTagName("tr")[0].parentNode.appendChild(newcn);
    document.getElementsByTagName("tr")[0].parentNode.insertBefore(newcn,document.getElementsByTagName("tr")[1]);
  }
</script>
</body>
</html>
